<template>
<h1>计算机练习</h1>

  <input type="text" placeholder="请输入数字1" v-model="num1">
  <input type="text" placeholder="请输入数字2" v-model="num2">
  <hr>
  <button @click="cacl('+')" >加</button>
  <button @click="cacl('-')">减</button>
  <button @click="cacl('*')">乘</button>
  <button @click="cacl('/')">除</button>
  <h3>运算结果:{{sum}}</h3>
</template>

<script setup>

import {ref} from "vue";

const num1 = ref();
const num2 = ref();
const sum = ref();

const cacl = (o)=>{
   //  eval(num1.value+o+num2.value) 会将字符串形式的算是转化为js形式运算
   sum.value = eval(num1.value+o+num2.value);
   console.log(num1.value,typeof num1.value)
}

</script>

<style scoped>

</style>